﻿<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title></title>
    <!--- 引入代码. -->
    <link rel="stylesheet" type="text/css" href="../Portal/icons/font-icons.min.css">
    <link rel="stylesheet" type="text/css" href="../Portal/icons/icons.css">
    <link rel="stylesheet" type="text/css" href="../Portal/layui/css/layui.css">
    <link rel="stylesheet" type="text/css" href="../Portal/layui/css/customer.css">
    <script type="text/javascript" src="../Portal/js/sortjs/Sortable.min.js"></script>
    <!--- 引入代码. -->
    <script src="../Scripts/jquery/jquery.min.js"></script>
    <script type="text/javascript" src="../Portal/layui/layui.js"></script>
    <script src="../Scripts/QueryString.js" type="text/javascript"></script>
    <script src="../Scripts/config.js" type="text/javascript"></script>
    <script src="../Comm/Gener.js" type="text/javascript"></script>
    <script type="text/javascript" src="../Portal/js/vue/vue.js"></script>
    <script src="../Scripts/layui/LayuiDialog.js"></script>
    <style>
        .flow {
            width: 100%;
        }

            .flow .row {
                display: flex;
                justify-content: flex-start;
                flex: 0.2;
                height: 40px;
                line-height: 40px;
                background-color: #FAFAFA;
            }

                /*.flow .row .item {*/
                /*    box-sizing: border-box;*/
                /*    flex-shrink: 0;*/
                /*    text-align: center;*/
                /*    width: 20%;*/
                /*    border: 1px solid #eee;*/
                /*    font-weight: 600;*/
                /*}*/

                .flow .row .item {
                    box-sizing: border-box;
                    flex-shrink: 0;
                    text-align: center;
                    border-right: 1px solid #eee;
                    border-bottom: 1px solid #eee;
                    overflow: hidden;
                }

        .item-name {
            width: 20%;
            text-overflow: ellipsis;
            white-space: nowrap;
            cursor: pointer;
            padding-left: 30px;
        }

        .item-other {
            width: 20%;
            max-width: 20%;
        }

        .item-other {
            width: 8%;
            max-width: 10%;
        }

        .item-index {
            background-color: #FAFAFA;
            padding-right: 30px;
            color: #999999;
        }

        .flow .row .system-item {
            box-sizing: border-box;
            width: 66%;
            padding-left: 20px;
            cursor: pointer;
        }

        .wrapper .row {
            background-color: #fff;
        }

        #s-main {
            transition: all ease .4s;
        }

        .item-menu {
            width: 26%;
            cursor: pointer;
        }

        .fixed {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
        }

        .item-module {
            width: 20%;
        }

        .item-menu-name {
            width: 10%;
            padding-left: 12px;
            cursor: pointer;
        }

        .module-name {
            width: 54%;
            padding-left: 12px;
            cursor: pointer;
        }

        .item-content {
            width: 30%;
        }

        .item-op {
            width: 8%;
        }

        [v-cloak] {
            display: none !important;
        }
        .h3_list {
            height: 40px;
            background: #fff;
            text-align: center;
            line-height: 40px;
           border-bottom:2px solid #dcdcdc;
        }
        .cenbody .itemlist {
            height: 44px;
        }

        .cenbody {
            height: 100vh;
            background: #fff;
            width: 90%;
            margin: 2px auto;
            padding-top: 20px;
        }
            .cenbody .itemlist .cenbox {
                background: #fff;
                height: 44px;
            }
        .cenbox:hover {
            border: 1px solid #333;
        }
            .cenbox:hover i {
                color: #333;
            }
        .au-bg-white {
            background: #fff;
        }
        .cenbox {
            text-align: center;
            line-height:60px;
        }
            .cenbox i {
                font-size: 24px;
                color: #999;
            }
    </style>
</head>

<body>
    <!--<div id="mymask">
        正在加载..
    </div>-->
    <div class="layui-row" id="flow">
        <div class="layui-col-md2 au-bg-white">
            <h3 class="h3_list">{{tabName}}</h3>
            <div class="layui-row layui-col-space10 cenbody" ref="iconTabs">
                <div class="layui-col-md3 itemlist"  v-for="(item,index) in flowNodes" :data-name="item.Name" :key="index" :data-iconid="item.No" :data-pid="item.ParentNo">
                    <div class="cenbox" @click="tabSystemEnableStatus(item.children,item.Name)">
                        <i :class="item.Icon"></i>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-col-md10">

            <div class="flow"  v-cloak>
                <div class="row">
                    <div class="item item-other" @click="expandAll = !expandAll">
                        <button class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs">
                            {{expandAll ? '折叠' : '展开'}}
                        </button>
                        <!--<div class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs" onclick="NewSys()">
                    <i class="icon-plus" style="margin-right: 6px"></i>创建系统
                </div>-->
                    </div>
                    <div class="item item-other">
                        <div class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs" onclick="NewSys()">
                            <i class="icon-plus" style="margin-right: 6px"></i>创建系统
                        </div>
                    </div>
                    <!--<div class="item item-name" @click="expandAll = !expandAll">-->
                    <div class="item item-name">

                        <!--<div class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs" onclick="ImpSys()">
                            <i class="icon-plus" style="margin-right: 6px"></i>导入系统
                        </div>-->

                        模块 / 菜单
                    </div>
                    <div class="item item-other">菜单类型</div>
                    <div class="item item-content">
                        <a href="https://www.bilibili.com/video/BV1eU4y137XU/" target="_blank" class="icon-camrecorder"><font color="blue">&nbsp;CCFast介绍</font></a>
                        <a href="https://www.bilibili.com/video/BV12P4y1p74h/" target="_blank" class="icon-camrecorder"><font color="blue">&nbsp;菜单体系</font></a>
                    </div>
                    <div class="item item-other">启用？</div>
                    <div class="item item-op">权限</div>
                    <div class="item item-op">操作</div>
                </div>
                <div id="s-main" ref="container">
                    <div class="wrapper" v-for="(item,index) in itemChildren" :key="index" :data-id="item.No" :data-pid="item.ParentNo"
                         :data-sysid="item.No">
                        <div class="row item-top-dp" @click="item.open = !item.open" :data-sysno="item.No" :data-name="item.Name"
                             :data-idx="index" style="background-color: rgba(227, 236, 243, 0.589);">
                            <div class="item item-other" style="text-align: center">
                                <i v-if="item.children && item.children.length > 0" class="layui-icon"
                                   :class="item.open ? 'layui-icon-up':'layui-icon-right'"></i>
                                <i v-else class="layui-icon layui-icon-subtraction"></i>
                            </div>
                            <div class="item system-item " style="text-align: left;background-color: rgba(227, 236, 243, 0.589);"
                                 :data-sysno="item.No" :data-name="item.Name" :data-idx="index">
                                <!--<i class="layui-icon layui-icon-set" style="margin-right: 8px"></i>-->
                                <!--<span @click.stop="Edit(item.No,item.Name,'BP.CCFast.CCMenu.MySystem')">{{item.Name}}</span>-->
                                <span><i :class="item.Icon"></i>&nbsp;&nbsp;&nbsp;{{item.Name}}</span>
                            </div>
                            <div class="item item-other" style="background-color: rgba(227, 236, 243, 0.589);">
                                <form class="layui-form" action="">
                                    <div class="layui-form-item" style="margin: 0">
                                        <div class="layui-input-block" style="margin: 0" :data-id="item.No"
                                             @click="changeSystemEnableStatus(item,this)">
                                            <input type="checkbox" lay-skin="switch" lay-text="ON|OFF"
                                                   :checked="parseInt(item.IsEnable) == 1" />
                                        </div>
                                    </div>
                                </form>
                            </div>
                            <div class="item item-op" @click.stop v-html="item.itemCtrlWayText" style="background-color: rgba(227, 236, 243, 0.589);"></div>
                            <div class="item item-op" style="background-color: rgba(227, 236, 243, 0.589);">
                                <button @click.stop :data-sysno="item.No" :data-name="item.Name" :data-idx="index"
                                        class="layui-btn layui-btn-primary layui-border-black layui-btn-sm t-btn">
                                    <i class="layui-icon layui-icon-down layui-font-12"></i>系统
                                </button>
                            </div>
                        </div>

                        <div v-show="item.open" :data-id="item.No" ref="sort-main" :data-pid="item.No"
                             :data-sysidx="index">
                            <div v-for="(module,idx) in item.children" :key="idx" :data-pid="item.No" :data-id="module.No"
                                 :data-moduleid="module.No" :data-sysidx="index">
                                <div class="row item-module-dp" @click="module.open = !module.open" :data-sysno="item.No"
                                     :data-moduleno="module.No" :data-name="module.Name" :data-pidx="index" :data-idx="idx">
                                    <div class="item item-module item-index" style="text-align: right;">
                                        <!--<i v-if="module.children.length > 0" class="layui-icon"
                       :class="module.open ? 'layui-icon-up':'layui-icon-right'"></i>-->
                                        <i class="layui-icon layui-icon-subtraction"></i>
                                    </div>
                                    <div class="item module-name " style="text-align: left" :data-sysno="item.No"
                                         :data-moduleno="module.No" :data-name="module.Name" :data-pidx="index" :data-idx="idx">
                                        <!-- 这里是子菜单的icon -->
                                        <!-- 这里是子菜单的icon -->
                                        <!-- 这里是子菜单的icon -->
                                        <span class="pull-right" style="margin-right:15px;">
                                            <button @click.stop="NewMenu(module.No)" class="layui-btn layui-btn-primary layui-border-primary layui-btn-xs">
                                                新建菜单
                                            </button>
                                        </span>
                                        <span><i :class="module.Icon"></i> {{module.Name}}</span>
                                        <!--<span @click.stop="Edit(module.No,module.Name,'BP.CCFast.CCMenu.Module')">{{module.Name}}</span>-->

                                    </div>
                                    <div class="item item-other">
                                        <form class="layui-form" action="">
                                            <div class="layui-form-item" style="margin: 0">
                                                <div class="layui-input-block" style="margin: 0" :data-id="module.No"
                                                     @click="changeMethodEnableStatus(module,this)">
                                                    <input type="checkbox" lay-skin="switch" lay-text="ON|OFF"
                                                           :checked="parseInt(module.IsEnable) == 1" />
                                                </div>
                                            </div>
                                        </form>
                                    </div>
                                    <div class="item item-op" v-html="module.moduleCtrlWayText"></div>
                                    <div class="item item-op">
                                        <button @click.stop
                                                class="layui-btn layui-btn-primary layui-border-primary layui-btn-xs module-btn"
                                                :data-name="module.Name" :data-moduleno="module.No" :data-pidx="index"
                                                :data-idx="idx">
                                            <i class="layui-icon layui-icon-down layui-font-12"></i> 模块
                                        </button>

                                    </div>
                                </div>

                                <!--<div v-show="module.open || module.children.length === 0" ref="child-row" :data-pid="module.No"
                 :data-sysidx="index" :data-moduleidx="idx">
                <div class="row item-menu-dp" v-for="(menu,menu_idx) in module.children" :key="menu_idx"
                     :data-menuno="menu.No" :data-pid="module.No" :data-id="menu.No" :data-sysidx="index"
                     :data-moduleidx="idx">
                    <div class="item item-menu item-index" style="text-align: right;">
                        <i class="layui-icon layui-icon-subtraction"></i>
                    </div>
                    <div title='点击编辑属性.' class="item item-menu-name " style="text-align: left;"
                         :data-menuno="menu.No" :data-name="menu.Name" :data-pidx="index" :data-idx="idx">-->
                                <!-- 这里是子菜单的icon -->
                                <!-- 这里是子菜单的icon -->
                                <!-- 这里是子菜单的icon -->
                                <!--<span>{{menu.Name}}</span>-->
                                <!--<span @click.stop="Edit(menu.No,menu.Name,'BP.CCFast.CCMenu.Menu', item.No)" style="color:deepskyblue">
                            <i :class="menu.Icon"></i> {{menu.Name}}
                        </span>

                    </div>
                    <div class="item item-other" v-html="menu.MenuModel"></div>
                    <div class="item item-content" v-html="menu.Docs"></div>
                    <div class="item item-other">
                        <form class="layui-form" action="">
                            <div class="layui-form-item" style="margin: 0">
                                <div class="layui-input-block" style="margin: 0" :data-id="menu.No"
                                     @click="changeMenuEnableStatus(menu,this)">
                                    <input type="checkbox" lay-skin="switch" lay-text="ON|OFF"
                                           :checked="parseInt(menu.IsEnable) == 1" />
                                </div>
                            </div>
                        </form>
                    </div>
                    <div class="item item-op" v-html="menu.MenuCtrlWayText"></div>

                    <div class="item item-op">
                        <button @click.stop
                                class="layui-btn layui-btn-primary layui-border-blue layui-btn-xs menu-btn"
                                :data-name="menu.Name" :data-menuno="menu.No" :data-pidx="index"
                                :data-idx="idx">
                            <i class="layui-icon layui-icon-down layui-font-12"></i> 菜单
                        </button>
                    </div>

                </div>

            </div>-->

                            </div>

                        </div>

                    </div>
                </div>

            </div>

        </div>
    </div>

    <script src="./Menus.js"></script>
</body>

</html>
